<template>
  <div>
    <el-form
      style="float: left"
      :inline="true"
      :model="formInline"
      label-width=""
      class="demo-form-inline"
    >
      <el-select v-model="formInline.region" style="width: 20%">
        <el-option label="post" :value="1"></el-option>
        <el-option label="get" :value="2"></el-option>
        <el-option label="delete" :value="3"></el-option>
        <el-option label="put" :value="4"></el-option>
      </el-select>
      <el-input v-model="formInline.url" style="width: 60%"></el-input>
      <el-button type="primary" @click="onSubmit">发送</el-button>
    </el-form>
    <br />
    <br />
    <br />
    <el-container>
      <el-header>
        <div style="float: left">
          <el-link type="primary" @click="switchs(1)">参数</el-link>
          <el-link type="primary" @click="switchs(2)">响应</el-link>
        </div>
      </el-header>
      <el-main>
        <el-input
          type="textarea"
          :rows="10"
          placeholder="请输入内容"
          v-model="textarea"
        >
        </el-input>
        <el-input
          type="textarea"
          :rows="10"
          placeholder="内容"
          disabled
          v-model="query"
        >
        </el-input>
      </el-main>
    </el-container>
  </div>
</template>
<script>
import axios from "axios";
// import { getRoleManageList } from "@/api/sysTools/SystemInterface";
export default {
  data() {
    return {
      formInline: {
        region: 1,
        url: "",
      },
      textarea: "",
      query: "",
      aswitch: 1,
    };
  },
  created() {},
  methods: {
    onSubmit() {
      let x = {};
      alert(this.formInline.region);
      if (this.textarea != "" && this.formInline.region != 2) {
        x = JSON.parse(this.textarea);
      }
      if (this.formInline.region == 1) {
        axios.post(this.formInline.url, x).then((res) => {
          this.query = JSON.stringify(res.data.data);
          console.log(this.query);
        });
      } else if (this.formInline.region == 2) {
        var s = this.formInline.url + "?" + this.textarea;
        console.log(s);
        axios.get(s).then((res) => {
          this.query = JSON.stringify(res.data);
          console.log(this.query);
        });
      } else if (this.formInline.region == 3) {
        axios.delete(this.formInline.url, x).then((res) => {
          this.query = JSON.stringify(res.data.data);
          console.log(this.query);
        });
      } else {
        axios.put(this.formInline.url, x).then((res) => {
          this.query = JSON.stringify(res.data.data);
          console.log(this.query);
        });
      }
    },
    switchs(a) {
      this.switch = a;
    },
  },
};
</script>
<style></style>